<template>
    <header class="header">
		<h1>todos</h1>
		<input 
            class="new-todo" 
            placeholder="What needs to be done?" 
            autofocus
            v-model.trim="title"
            @keydown.enter="addFn">
	</header>
</template>

<script>
export default {
    data () {
        return {
            title:''
        }
    },
    methods: {
        addFn(){
            if (!this.title) return alert('输入内容不为空')
            this.$emit('add-todo',this.title),
            this.title = ''
        }
    }
}
</script>

<style>

</style>